@import "const"
@import 'nib'
/*
 * Globals
 */

body
  font-family "Helvetica Neue", "Luxi Sans", "DejaVu Sans", Tahoma, "Hiragino Sans GB", STHeiti !important
  color #555

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  margin-top: 0;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: normal;
  color: #333;
}

/*
 * Override Bootstrap's default container.
 */

// @media (min-width: 1200px) {
//   .container {
//     width: 970px;
//   }
// }

/*
 * Masthead for nav
 */

.wall-masthead {
  background-color: #444;
  -webkit-box-shadow: inset 0 -2px 5px rgba(0, 0, 0, .1);
  box-shadow: inset 0 -2px 5px rgba(0, 0, 0, .1);
}

/* Nav links */
.wall-nav-logo
  img
    width 120px
    margin-top -10px
    margin-left -30px

.wall-nav-item {
  position: relative;
  display: inline-block;
  padding: 15px;
  font-weight: 500;
  color: #fff;
}

.wall-nav-item:hover,
.wall-nav-item:focus {
  color: #fff;
  text-decoration: none;
}

.form-control
  border-color $mainColor
  &:focus
    border-color $mainColor
    box-shadow 0 0 10px rgba(0, 0, 0, 1)

.navbar-form
  position relative
  box-sizing border-box
  input
    padding 0px 25px
    transition padding .2s
  #search-icon
    position absolute
    left 25px
    top 50%
    margin-top -7px
  #search-icon-2
    display none
    position absolute
    left inherit
    right 25px
    top 50%
    margin-top -7px
  &.focus
    input
      padding-left 10px
      padding-right 40px
      box-shadow 0 0 10px rgba(0, 0, 0, 1)
      outline none

/* Active state gets a caret at the bottom */
.wall-nav .active {
  color: #fff;
}

.wall-nav .active:after {
  position: absolute;
  bottom: -1px;
  left: 50%;
  width: 0;
  height: 0;
  margin-left: -5px;
  vertical-align: middle;
  content: " ";
  border-right: 5px solid transparent;
  border-bottom: 5px solid;
  border-left: 5px solid transparent;
}

/*
 * wall name and description
 */

.wall-header {
  padding-top: 20px;
  padding-bottom: 20px;
}

.wall-title {
  margin-top: 30px;
  margin-bottom: 0;
  font-size: 60px;
  font-weight: normal;
}

.wall-description {
  font-size: 20px;
  color: #999;
}

/*
 * Main column and sidebar layout
 */

.wall-main
  font-size 18px
  line-height 1.5
  margin 15px 0px
  border-radius 4px
  box-shadow 0 0 15px rgba(0, 0, 0, 0.5)

.wall-main-header
  background-color #f6f6f6
  border-radius 4px 4px 0px 0px
  ul
    display flex
    height 40px
    padding-left 10px
    margin 0
    align-items center
  li
    display flex
    margin 0px 10px
    list-style none
    a
      text-decoration none
      display inline-block
      color $secondColor
      font-size 15px
      padding 0px 4px
      border-radius 3px
  & li.active a
    color $whiteColor
    background-color $secondColor

/* Sidebar modules for boxing content */
.wall-sidebar
  padding 0px 10px
  margin-top 15px

@-webkit-keyframes greenPulse {
  from { background-color: #749a02; box-shadow: 0 0 9px #333; }
  50% { background-color: #91bd09; box-shadow: 0 0 18px #91bd09; }
  to { background-color: #749a02; box-shadow: 0 0 9px #333; }
}

.sidebar-module-inset
  h4
    font-size 14px
  #git-login
    text-decoration none
    display inline-block
    float none
    padding 3px 10px
    border none
    margin 0
    font-size: 14px
    transition all .2s ease-in-out
    cursor pointer
    letter-spacing 2px
    box-shadow none
    border-radius 3px
    line-height 2em
    vertical-align middle
    color #fff
    background-color $secondColor
    animation-name greenPulse
    animation-duration 3s
    animation-iteration-count infinite

.sidebar-module
  padding 15px
  margin 0px
  margin-bottom 13px
  box-shadow 0 0 15px rgba(0, 0, 0, 0.5)
  border-radius 4px

/*
 * wall posts
 */

.wall-post
  background $whiteColor
  border-bottom 1px solid $borderColor
  display flex
  padding 10px 20px
  &.active
    background #f5f5f5
  a
    width 100%
    display flex
    flex-direction row
    align-items center
    text-decoration none
    color #333
    &:visited
      color #888
    img.wall-post-own
      width 30px
      height 30px
    .wall-post-read
      width 70px
      font-size 14px
      display flex
      align-items center
      justify-content  center

      span
        margin 0 1px
    .wall-post-seperate
      margin 0 -3px
      font-size 10px
    .wall-post-reply
      color #9e78c0
    .wall-post-visit
      font-size 10px
      color #b4b4b4
    h3
      margin 0px
      width 650px
      font-size 16px
      overflow ellipsis
      span
        margin 0 3px
        background $secondColor
        padding 2px 4px
        border-radius 3px
        color #fff
        font-size 12px
    .wall-post-time
      font-size 11px
      text-align right
      min-width 50px
      display inline-block
      white-space nowrap
    img.wall-post-comment
      width 20px
      height 20px
      margin 0px 10px

/* Pagination */
.pagination
  margin 10px 0 0 5px

.pagination > li > a
  font-size 14px
  line-height 20px
  color #778087
  padding 4px 12px

.pagination>li>a:focus, .pagination>li>a:hover, .pagination>li>span:focus, .pagination>li>span:hover
  color $secondColor
/*
 * Footer
 */

.wall-footer
  padding 40px 0
  color #999
  text-align left
  background-color #f9f9f9
  border-top 1px solid #e5e5e5

.wall-footer p:last-child
  margin-bottom 0
